pamo18 /
pamo18.me
| Total Complexity | 5 |
| Total Lines | 62 |
| Duplicated Lines | 0 % |
| Changes | 0 | ||
| 1 | /*eslint max-len: ["error", { "code": 150 }]*/ |
||
| 9 | |||
| 10 | class Profile extends Component { |
||
| 11 | static propTypes = { |
||
| 12 | match: PropTypes.object.isRequired, |
||
| 13 | location: PropTypes.object.isRequired, |
||
| 14 | history: PropTypes.object.isRequired |
||
| 15 | }; |
||
| 16 | constructor(props) { |
||
| 17 | super(props); |
||
| 18 | this.logoff = this.logoff.bind(this); |
||
| 19 | this.state = { |
||
| 20 | user: "", |
||
| 21 | username: "" |
||
| 22 | }; |
||
| 23 | } |
||
| 24 | componentDidMount() { |
||
| 25 | this.getProfile(); |
||
| 26 | } |
||
| 27 | logoff() { |
||
| 28 | localStorage.clear(); |
||
| 29 | socket.emit('log off', this.state.username); |
||
| 30 | this.setState({ |
||
| 31 | user: "" |
||
| 32 | }); |
||
| 33 | this.props.history.push('/login'); |
||
| 34 | window.location.reload(false); |
||
| 35 | } |
||
| 36 | getProfile() { |
||
| 37 | if (localStorage.getItem("activeUser")) { |
||
| 38 | let user = localStorage.getItem("activeUser"), |
||
| 39 | profile = []; |
||
| 40 | |||
| 41 | profile = JSON.parse(user); |
||
| 42 | this.setState({ |
||
| 43 | user: [ |
||
| 44 | <div key="profile"> |
||
| 45 | <h3 className="center">Username: {profile.name}</h3> |
||
| 46 | <h4 className="center">Birthday: {profile.birthday}</h4> |
||
| 47 | <h4 className="center">Country: {profile.country}</h4> |
||
| 48 | <h4 className="center">Email: {profile.email}</h4> |
||
| 49 | <p> |
||
| 50 | <button name="logoff" className="button center" onClick={this.logoff}>Logoff</button> |
||
| 51 | </p> |
||
| 52 | </div> |
||
| 53 | ], |
||
| 54 | username: profile.name |
||
| 55 | }); |
||
| 56 | } else { |
||
| 57 | this.setState({ |
||
| 58 | user: [ |
||
| 59 | <h3 key="registerfirst" className="center">Your profile will be shown below when you register</h3> |
||
| 60 | ] |
||
| 61 | }); |
||
| 62 | } |
||
| 63 | } |
||
| 64 | |||
| 65 | render() { |
||
| 66 | return ( |
||
| 67 | <article> |
||
| 68 | <h1>Profile page</h1> |
||
| 69 | { this.state.user } |
||
| 70 | </article> |
||
| 71 | ); |
||
| 76 |
